import { IMOptionsType } from "@/types/dict";
import { IMTableType } from "@/types/table";
import { DrawerFormStateType } from "./type";
export const operateType = ref<any>("");
export const queryParams = reactive<any>({});
export const tableActiveKey = ref(0);
export const tabPower = reactive([true, true]);
export const tabsOptions = computed(() =>
  ([] as IMOptionsType[])
    .concat(
      tabPower[0]
        ? {
            label: getProxyT("withdraw0"),
            value: 0,
          }
        : []
    )
    .concat(
      tabPower[1]
        ? {
            label: getProxyT("withdraw1"),
            value: 1,
          }
        : []
    )
);
export const paymentMerchantOptions = ref<any>([]);
export const statusListOptions = ref<any>([]);
export const defaultColumns = reactive([
  [
    { title: getProxyT("base.index"), dataIndex: "index", key: "index" },
    {
      title: getProxyT("table126"),
      dataIndex: "order_number",
      key: "order_number",
    },
    {
      title: getProxyT("table164"),
      dataIndex: "withdraw_time",
      key: "withdraw_time",
      customRender: ({ text }: any) => getTimeByZone(text),
    },
    {
      title: getProxyT("table165"),
      dataIndex: "user_info",
      key: "user_info",
    },
    {
      title: getProxyT("table2"),
      dataIndex: "phone_number",
      key: "phone_number",
    },
    { title: getProxyT("table166"), dataIndex: "status", key: "status" },
    {
      title: getProxyT("table167"),
      dataIndex: "withdraw_amount",
      key: "withdraw_amount",
    },
    {
      title: getProxyT("table168"),
      dataIndex: "arrival_amount",
      key: "arrival_amount",
    },
    {
      title: getProxyT("table169"),
      dataIndex: "passageway_name",
      key: "passageway_name",
    },
    {
      title: getProxyT("table170"),
      dataIndex: "pay_platform",
      key: "pay_platform",
    },
    {
      title: getProxyT("table171"),
      dataIndex: "arrival_time",
      key: "arrival_time",
      customRender: ({ text }: any) => getTimeByZone(text),
    },
    {
      title: getProxyT("table172"),
      dataIndex: "third_order_number",
      key: "third_order_number",
    },
    {
      title: getProxyT("table44"),
      dataIndex: "operate_time",
      key: "operate_time",
      customRender: ({ text }: any) => getTimeByZone(text),
    },
    {
      title: getProxyT("table23"),
      dataIndex: "operator",
      key: "operator",
    },
    { title: getProxyT("base.action"), key: "action" },
  ],
  [],
]);
export let columns = reactive<IMTableType[]>([
  ...defaultColumns[tableActiveKey.value],
]);
export const defaultSearchList = reactive([
  [
    {
      label: getProxyT("withdraw33"),
      type: "input",
      model: "order_number",
      allowClear: true,
      placeholder: getProxyT("placeholder141"),
    },
    {
      label: getProxyT("withdraw36"),
      type: "rangePicker",
      model: "withdraw_time",
      placeholder: computed(() => [$t("base.startTime"), $t("base.endTime")]),
    },
    {
      label: getProxyT("withdraw40"),
      type: "select",
      model: "pay_platform_id",
      placeholder: getProxyT("placeholder171"),
      searchClass: "search-item-width-200",
      allowClear: true,
      showArrow: true,
      filterOption: filterOption,
      options: paymentMerchantOptions,
      showSearch: true,
      bindingValue: "textFilter", //  "textFilter.trim",
      on: {
        keyup({ target }) {
          // only_limit_charts(target);
        },
      },
    },
    {
      label: getProxyT("withdraw56"),
      type: "input",
      model: "withdraw_user",
      allowClear: true,
      placeholder: getProxyT("placeholder172"),
    },
    {
      label: getProxyT("withdraw71"),
      type: "select",
      model: "status",
      placeholder: getProxyT("placeholder173"),
      searchClass: "search-item-width-5",
      allowClear: true,
      options: statusListOptions,
    },
    {
      label: getProxyT("withdraw37"),
      type: "rangePicker",
      model: "arrival_time",
      placeholder: computed(() => [$t("base.startTime"), $t("base.endTime")]),
    },
  ],
  [],
]);
export const searchList = ref<any>(defaultSearchList[tableActiveKey.value]);
export const winRef = ref<any>();
export const wrapRef = ref<any>(null);
export const withdrawRuleForm = reactive<any>({
  name: undefined,
  amount_list: undefined,
  comment: undefined,
  is_withdraw_amount_limit: 0,
  handling_fee_percentage: undefined,
  is_handling_fee: undefined,
  max_withdraw_amount: undefined,
  max_withdraw_count: undefined,
});
export const drawerFormState = reactive<any>({});
export const defaultFormState = reactive<DrawerFormStateType>([
  {
    id: undefined,
    order_number: undefined,
    pay_platform: undefined,
    passageway_name: undefined,
    status: undefined,
    withdraw_time: undefined,
    arrival_time: undefined,
    user_info: undefined,
    phone_number: undefined,
    third_order_number: undefined,
    withdraw_amount: undefined,
    arrival_amount: undefined,
    source_type: undefined,
    is_handling_fee: undefined,
    handling_fee: undefined,
    order_type: undefined,
  },
  {
    id: undefined,
    name: undefined,
    amount_list: [],
    comment: undefined,
    is_withdraw_amount_limit: 0,
    handling_fee_percentage: undefined,
    is_handling_fee: undefined,
    max_withdraw_amount: undefined,
    max_withdraw_count: undefined,
  },
]);
export const resetFormState = (formState) => {
  const currentFormState = defaultFormState[tableActiveKey.value];
  initObjAttr(formState, currentFormState);
};
resetFormState(drawerFormState);
export const set_formState = (
  type: string,
  formState: any = {},
  data: any = {}
) => {
  resetFormState(formState);
};
export const isDisplay = ref(false);
export const modal_disable_ok_button = ref(true);
export const defaultModalFormState = reactive<any>([
  {
    withdraw_id: undefined,
    pay_platform_id: undefined,
    withdraw_amount: undefined,
    withdrawal_amount: undefined,
    passageway: undefined,
    amount: undefined,
    reason: undefined,
  },
  {
    temValue: undefined,
  },
]);
export const defaultVisible = toRefs(reactive([false, false]));
export const merchantOptions = ref<any>([]);
export const tmpMerchantOptions = ref<any>([]);
export const agreeLoading = ref(false);
export const drawerInstance = ref<any>(null);
export const refreshComponent = ref(true);
export const drawer_disable_ok_button = computed(() => {
  if (tableActiveKey.value === 0) {
    return false;
  }
  if (
    drawerFormState.is_handling_fee === 0 &&
    drawerFormState.is_withdraw_amount_limit === 0
  ) {
    return (
      isEmptyType(drawerFormState.name) ||
      isEmptyType(drawerFormState.amount_list)
    );
  }

  if (
    drawerFormState.is_handling_fee === 0 &&
    drawerFormState.is_withdraw_amount_limit === 1
  ) {
    return (
      isEmptyType(drawerFormState.name) ||
      isEmptyType(drawerFormState.amount_list) ||
      (isEmptyType(drawerFormState.max_withdraw_amount) &&
        isEmptyType(drawerFormState.max_withdraw_count))
    );
  }

  if (
    drawerFormState.is_handling_fee === 1 &&
    drawerFormState.is_withdraw_amount_limit === 0
  ) {
    return (
      isEmptyType(drawerFormState.name) ||
      isEmptyType(drawerFormState.amount_list) ||
      isEmptyType(drawerFormState.handling_fee_percentage)
    );
  }

  return (
    isEmptyType(drawerFormState.name) ||
    isEmptyType(drawerFormState.amount_list) ||
    isEmptyType(drawerFormState.handling_fee_percentage) ||
    (isEmptyType(drawerFormState.max_withdraw_amount) &&
      isEmptyType(drawerFormState.max_withdraw_count))
  );
});
export const drawerInputValidators = reactive(createArray(false, 3));
export const isChecked = reactive([false, false]);
export const tradeStatusDict: IMOptionsType[] = [
  {
    value: 0,
    label: getProxyT("dict22"),
  },
  {
    value: 1,
    label: getProxyT("dict23"),
  },
  {
    value: 2,
    label: getProxyT("dict24"),
  },
  {
    value: 3,
    label: getProxyT("dict25"),
  },
];
watch([() => tabPower[0], () => tabPower[1]], (newArrayState) => {
  if (newArrayState.some((item) => item === true))
    initObjAttr(columns, defaultColumns[tableActiveKey.value]);
  if (newArrayState.every((item) => item === false)) initObjAttr(columns, []);
});
